<template>
  <div>
    <input
      type="text"
      placeholder="请选择"
      disabled
       @click="show"
      v-model="chooseItem"
    >
    <mpvue-picker
      ref="mpvuePicker"
      :mode="mode"
      :pickerValueDefault="pickerValueDefault"
      :deepLength="deepLength"
      @onConfirm="onConfirm"
      @onCancel="onCancel"
      :pickerValueArray="pickerValueArray"
    ></mpvue-picker>
  </div>
</template>
<script>
import mpvuePicker from 'mpvue-picker'
import Collection from 'lodash/collection'
export default {
  props: ['typeCode', 'value'],
  components: {
    mpvuePicker
  },
  data () {
    return {
      pickerValueArray: [],
      pickerValueDefault: [],
      chooseValue: ''
    }
  },
  computed: {
    chooseItem () {
      if (this.value) {
        this.chooseValue = this.value
        let result = JSON.parse(wx.getStorageSync('dics'))
        if (result) {
          let dic = Collection.filter(result, { type: this.type, value: this.value.toString() })
          if (dic && dic.length > 0) {
            return dic[0].code
          } else {
            return this.value
          }
        } else {
          return this.value
        }
      } else {
        return ''
      }
    },
    type (v) {
      return this.typeCode
    }
  },
  methods: {
    show () {
      this.$refs.mpvuePicker.show()
    },
    onConfirm  (e) {
      this.chooseItem = e.label
      this.$emit('input', e.value[0])
    }
  },
  mounted () {
    let result = JSON.parse(wx.getStorageSync('dics'))
    let list = Collection.filter(result, { type: this.type })
    if (list.length > 0) {
      for (let i in list) {
        this.pickerValueArray.push({
          label: list[i].code,
          value: list[i].value
        })
      }
    }
  }
}
</script>
